// pages/product/product.js
var Tool = require('../../config/tool.js');
var WxParse = require('../../wxParse/wxParse.js');
import Toast from '../../miniprogram_npm/_vant-weapp@0.5.7@vant-weapp/toast/toast'; 

const app = getApp()
//团购详情
import { getDisteData, setLogin, getCodeIndex, getMyMine} from '../../config/https'
Page({

  /**
   * 页面的初始数据
   */
  data: {
    heiGht: 750,                      //画布高度
    typeSta:"",                       //判断是否已经结束团购时间
    is_join:'',                       //是否参团0没有1有
    height:'',                        //轮播高度
    numOrder:'',                      //团购数量
    show:false,                       //参数弹出状态
    text:[],                          //测试倒计时
    product: {},                      // 商品数据
    cardInfo: {          //画布内容
      avater: "",    //需要https图片路径
      qrCode: "https://ws3.sinaimg.cn/large/007goYVsly1fyt721ceklj3076076t94.jpg",        //需要https图片路径
      Name: '',      //名字
      Position: "",              //价格
      Position1: "",             //价格2qrCode
      Company: "长按识别小程序",        //识别
    },
    ishow: false,                       //画布隐藏
    isshow:false,                //购买弹窗
    contenner:1          //购物车的值
  },
  ison() {//分享弹窗
    let that=this;
    let show = !that.data.show;
    this.setData({ show });
    //  二维码接口
    getCodeIndex({
      scene: wx.getStorageSync("userInfo"),//本人id
      pages: 'pages/tapswitching/tapswitching',   
    }).then(res => {
      let cardInfo = that.data.cardInfo
      cardInfo.qrCode = res.qrcode
      that.setData({ cardInfo })
      console.log(res)
    })
  },
// 生命周期函数--监听页面加载
  onLoad: function (options) {
    var that = this;
    const userInfo = wx.getStorageSync("authKey");
    if (!userInfo) {
      wx.login({
        success(res) {
          console.log(res)
          var code = res.code
          setLogin({
            code: code,
            // user_json: userInfo
          }).then(res => {
            console.log(res)
            app.globalData.stastaVip = res.version
            app.globalData.userInfo = res.auth_key
            wx.setStorage({
              key: 'authKey',
              data: res.auth_key,
            })
          }).catch(res => {
            console.log(res)
          })
        }
      })
    }
    console.log(Number('06') > Number('00'))
    
    //上个页面的商品id
    if(options.id){
      that.setData({
        id:options.id
      })
    }
    that.setData({ nickname:wx.getStorageSync("nickname")})
  },
  //获取轮播高度
  imgHeight: function (e) {
    var winWid = wx.getSystemInfoSync().windowWidth; //获取当前屏幕的宽度
    var imgh = e.detail.height; //图片高度
    var imgw = e.detail.width; //图片宽度
    var swiperH = winWid * imgh / imgw + "px"
    this.setData({
      height: swiperH //设置高度
    })
  },
  //商品详情
  onDatsData(){
    var that = this
    getDisteData({
      id: that.data.id
    }).then(res=>{
      console.log(res)
      // 画布
      let cardInfo = that.data.cardInfo; //获取画布内容
      cardInfo.avater = res.goods.thumb_url[0]; //获取画布主图片
      cardInfo.Name = res.goods.title;//获取画布名字
      cardInfo.Position = res.goods.groupsprice; //获取画布价格1
      cardInfo.Position1 = res.goods.price; //获取画布价格2
      cardInfo.Position1 = res.goods.price; //获取二维码
      that.setData({cardInfo})


      //结束时间
      var createtime = res.goods.endtime;
      // console.log(createtime)
      //现在的时间
      var timestamp = Date.parse(new Date()) / 1000;
      // console.log(timestamp)
      //剩余倒计时
      let last = createtime - timestamp
      clearInterval(that.time);
      //团购倒计时开始
      that.time = setInterval(() => {
        var text = Tool.count(last ? last : 0);
        that.setData({ text})
        if (last > 0) { 
          last--;
        that.setData({typeSta:true})}else{
          that.setData({ typeSta: false })
        }
      }, 1000);
      var numOrder = res.orders
      that.setData({
        numOrder
      })
      var orderSeta = res.orders
      if (orderSeta.length>6){
        orderSeta.length = 6
      }
      that.setData({
        orderid: res.owner_order.id,
        teamid: res.owner_order.teamid,
        is_join: res.is_join,
        goods:res.goods,
        orderList:orderSeta,
      })
      WxParse.wxParse('article', 'html', res.goods.content, that, 5);
    }).catch(err=>{
      Toast(err.message)
    })
  },

  onReady: function () {//生命周期函数--监听页面初次渲染完成

  },


  onShow: function () {//生命周期函数--监听页面显示
    this.onDatsData()
    getMyMine({
    }).then(res => {
      wx.setStorage({
        key: 'nickname',
        data: res.member.nickname,
      })
      if (res.member.nickname == '') {
        wx.hideShareMenu();   //隐藏右上角转发按钮
      } else {
        wx.showShareMenu()  //显示右上角转发按钮
      }
      this.setData({ nickname: res.member.nickname })
    })
  },
// --------------------------------点击购买--------------------------
  // 点击参与拼团
  onPurOrders(e){
    let that=this;
    let typeSta = that.data.typeSta
    if (!typeSta) {
      Toast("当前活动已经结束")
      return
    }
    if (that.data.goods.groupnum - that.data.goods.fightnum == 0) {
      Toast("当前活动已经结束")
      return
    }
    if (that.data.is_join == 1) {
      Toast("您已参与本商品的拼团")
      return
    } 
    //else if (that.data.goods.purchaselimit==0){
    //   Toast("此商品限購" + that.data.goods.purchaselimit+"件")
    //   return
    //} 
    else {
      let isshow = !this.data.isshow; //购买弹窗
      this.setData({ isshow })
    }
    
    
  },

  jia() {  //数量加加++
    let that=this;
    let contenner = that.data.contenner; //购买的数量
    let goods = that.data.goods; //详情页数据
    let stock = goods.stock;//库存
    let purchaselimit = goods.purchaselimit; //限购  
    contenner++;
    if (contenner > stock ) { //大于库存
      Toast('库存不足')
      this.setData({ contenner: stock})
      return
    } else if (contenner >purchaselimit){
      if (purchaselimit ==0 ){
        this.setData({ contenner})
      }else{
        Toast('限购' + purchaselimit + "件")
        this.setData({ contenner: purchaselimit })
      }
      return
    }else {
      this.setData({ contenner })
    }
   
  },

  jian() {//数量减减 --
    let contenner = this.data.contenner;
    contenner--;
    if (this.data.contenner==0){
      Toast('此商品限购0件')
    } else if (contenner < 1) {
      Toast("亲~ 宝贝最少一件哟")
      return
    } else {
      this.setData({ contenner })
    }
    
  },
  addToCart(e){ //点击确定购买跳转到支付页面
    let contenner=this.data.contenner;
    let that=this;

    if (Number(that.data.goods.purchaselimit) != 0) {
      if (that.data.goods.order_goodscount + Number(contenner) > Number(that.data.goods.purchaselimit)) {
        Toast("此商品最多只能买 " + that.data.goods.purchaselimit + " 件哦")
        return
      }
    }
    const userInfo = wx.getStorageSync("authKey");
    const nickname = wx.getStorageSync("nickname");
    if (!userInfo || !nickname){ //代表没授权 没登陆
      wx.navigateTo({
        url: '/pages/logs/logs',
      })
    } else {   //代表已经授权 已经登陆
      if (that.data.contenner != 0) {
        wx.navigateTo({
          url: '/pages/shoppurorders/shoppurorders?id=' + e.currentTarget.dataset.id + '&contenner=' + contenner,
        })
      }
    }
  },
// ---------------------------------------------------------------------------------------
  //跳转购买记录
  onRecord(){
    if (this.data.numOrder.length>0){
      wx.navigateTo({
        url: '/pages/purchaseRecord/purchaseRecord?id=' + this.data.id,
      })
    }else{
      Toast("还没有人购买 快快参与吧~~")
    }
    
  },
  // 跳转确定订单页面已经付款
  onPuser(){
    const userInfo = wx.getStorageSync("authKey");
    if (!userInfo) {
      wx.navigateTo({
        url: '/pages/logs/logs',
      })
      return
    }
    wx.navigateTo({
      url: '/pages/paymenstapur/paymenstapur?type=0&orderid=' + this.data.orderid+'&teamid='+this.data.teamid,
    })
  },
  //点击弹出层显示或者隐藏
  // onClose() {
  //   let show = !this.data.show;
  //   this.setData({show});
  // },

  //点击收藏
  // shouc() {
  //   let trueto = !this.data.trueto;
  //   this.setData({ trueto })
  // },

  // 跳转首页
  onIndex(){
    wx.reLaunch({
      url: '/pages/tapswitching/tapswitching',
    })
  },
  /**
    * 生命周期函数--监听页面隐藏
    */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
    let that = this
    let id = that.data.goods.id
    return {
      title: that.data.goods.groupsprice + '元' + that.data.goods.title,
      path: '/pages/directbuyingto/directbuyingto?id=' + id + '&type=0' + '&userid=' + wx.getStorageSync('userInfo'), 
      imageUrl: that.data.goods.thumb_url[0],  //转发图片 默认当前页面图片
      success: (res) => {//转发成功
        console.log("转发成功", res);
      }
    }
  },
  // 画布 开始
  sanchu() {//点击删除
    this.setData({ ishow: false }) //海报隐藏
  },
  //点击海报
  getAvaterInfo() {
    var that = this;
    let cardInfo = that.data.cardInfo; //海报相关内容
    that.setData({ ishow: true }) //海报显示
    that.ison() //分享弹窗
    console.log(that.data.cardInfo)

    wx.showLoading({//loading提示框 
      title: '头像生成中..',//提示的内容
      mask: true, //是否显示透明蒙层，防止触摸穿透
    });

    wx.downloadFile({ // 下载头像图片
      url: cardInfo.avater, //图片链接
      success(res) {
        if (res.statusCode === 200) { //下载成功
          wx.hideLoading(); //隐藏 loading 提示框
          var avaterSrc = res.tempFilePath; //头像下载成功的图片路径
          that.getQrCode(avaterSrc);  //调用生成二维码函数
        } else { //下载失败
          wx.showToast({ //显示消息提示框
            title: '头像生成失败！', //提示的内容
            icon: 'none', //图标 默认'success'
            duration: 2000, //提示的延迟时间 
            success() { //接口调用成功的回调函数
              var avaterSrc = ""; //头像下载失败的图片路径
              that.getQrCode(avaterSrc);  //调用生成二维码函数
            }
          })
        }
      }
    })
  },
  // /*下载二维码图片函数*/
  getQrCode(avaterSrc) {//avaterSrc头像图片地址
    let that = this;
    wx.showLoading({ //loading提示框 
      title: '二维码生成中..', //提示的内容
      mask: true, //是否显示透明蒙层，防止触摸穿透
    });
    wx.downloadFile({ //下载文件资源到本地。
      url: that.data.cardInfo.qrCode,  //二维码图片路径
      success(res) {  //成功回调函数  
        wx.hideLoading(); //隐藏 loading 提示框
        if (res.statusCode === 200) { //200成功状态
          var codeSrc = res.tempFilePath; //下载成功返回结果
          that.sharePosteCanvas(avaterSrc, codeSrc);  //图片下载成功 然后canvas绘制分享海报
        } else {
          wx.showToast({ //显示消息提示框
            title: '二维码生成失败！', //提示的内容
            icon: 'none',  //图标 默认'success'
            duration: 2000, //提示的延迟时间
            success: function () { //接口调用成功的回调函数
              var codeSrc = ""; //下载失败的图片在海报上显示空白
              that.sharePosteCanvas(avaterSrc, codeSrc); //调用 绘制海报的函数
            }
          })
        }
      },
      fail(err) {
        wx.showToast({ //显示消息提示框
          title: '二维码生成失败！', //提示的内容
          icon: 'none',  //图标 默认'success'
          duration: 2000, //提示的延迟时间
          success: function () { //接口调用成功的回调函数
            var codeSrc = ""; //下载失败的图片在海报上显示空白
            that.sharePosteCanvas(avaterSrc, codeSrc); //调用 绘制海报的函数
          }
        })
      }
    })
  },
  // 绘制海报
  sharePosteCanvas(avaterSrc, codeSrc) {
    wx.showLoading({ //loading提示框 
      title: '海报生成中..', //提示的内容
      mask: true, //是否显示透明蒙层，防止触摸穿透
    })
    var that = this;
    //获取当前屏幕的宽度
    var rpx = wx.getSystemInfoSync().windowWidth / 375;

    var cardInfo = that.data.cardInfo; //需要绘制的数据集合  data里定义的数据
    const ctx = wx.createCanvasContext('myCanvas'); //创建画布 myCanvas wxml里定义的画布
    //返回一个 SelectorQuery 对象实例。 //#canvas-container获取画布的父级容器
    wx.createSelectorQuery().select('#canvas-container').boundingClientRect(function (rect) {
      const CONTENT_ROW_LENGTH = 28; // 正文 单行显示字符长度
      let [contentLeng, contentArray, contentRows] = that.textByteLength(cardInfo.Name, CONTENT_ROW_LENGTH);
      let contentH = 22 * 1 * rpx;  //相当于行高  就是一行所占的高度
      let i = contentArray.length; //字体变成了几行？
      var right = rect.right;  //右
      var width = 498 * rpx; //宽度
      var left = rect.left + 5 * rpx; //图像距离画布的左上角 x 坐标
      ctx.setFillStyle('#fff'); //生成的海报的背景色
      console.log(right) //画布父容器
      //在画布上绘制被填充的文本 
      // 一参数：绘制文本的左上角 x 坐标位置  二参数：绘制文本的左上角 y 坐标位置 （绘制的文本所在的位置）
      // 三参数：需要绘制的最大宽度  四从参数：需要绘制的最大高度
      ctx.fillRect(0, 0, width, that.data.heiGht + contentH * i);
      that.setData({ heiGht: that.data.heiGht + contentH * i })
      // 1、  
      ///绘制头像到画布
      if (avaterSrc) { //avaterSrc 头像的图片地址
        //第一个参数：所要绘制的图片  第二个参数：图像距离画布的左x 坐标
        //第三个参数：图像距离画布的上 y 坐标 第四个参数:头像的宽度  第五个参数：头像的高度
        ctx.drawImage(avaterSrc, 29 * rpx, 16 * rpx, 191 * rpx, 191 * rpx);
      }
      //姓名
      if (cardInfo.Name) { //数据的集合 里的姓名
        const CONTENT_ROW_LENGTH = 26; // 正文 单行显示字符长度
        let [contentLeng, contentArray, contentRows] = that.textByteLength(cardInfo.Name, CONTENT_ROW_LENGTH);

        ctx.setFontSize(15); // 设置字体大小
        ctx.setFillStyle('#333333');//设置字体颜色
        ctx.setTextAlign('left');//文字的对齐方式 左对齐

        var contentHh = 18 * 1 * rpx;  //相当于行高  就是一行所占的高度
        var j = contentArray.length;

        for (let i = 0; i < contentArray.length; i++) {
          //第一个参数：在画布上输出的文本； 第二个参数：图像距离画布的左 x 坐标    第三个参数：图像距离画布的上角 y 坐标 
          ctx.fillText(contentArray[i], 29 * rpx, (230 + contentHh * i) * rpx);
        }
      }
      //价格
      if (cardInfo.Position) {//数据的集合 里的价格
        ctx.setFontSize(20 * rpx);
        ctx.setFillStyle('#EE0000');
        ctx.setTextAlign('left');
        //第一个参数：在画布上输出的文本； 第二个参数：图像距离画布的左上角 x 坐标    第三个参数：图像距离画布的上角 y 坐标 
        ctx.fillText("￥" + cardInfo.Position, 26 * rpx, (244 + contentHh * j) * rpx);
      }

      //价格1
      if (cardInfo.Position1) {//数据的集合 里的价格1
        ctx.setFontSize(15 * rpx);
        ctx.setFillStyle('#999999');
        ctx.setTextAlign('left');
        //第一个参数：在画布上输出的文本； 第二个参数：图像距离画布的左上角 x 坐标    第三个参数：图像距离画布的上角 y 坐标 
        ctx.fillText("￥" + cardInfo.Position1, 123 * rpx, (244 + contentHh * j) * rpx);
      }
      //删除线
      ctx.beginPath()//beginPath(被根帕斯)
      //定义线条的起始点
      ctx.moveTo(113 * rpx, (238 + contentHh * j) * rpx)//moveTo:移动至(木吐)  里面的值是点在画布里横轴纵轴的位置
      //定义线条的结束点
      ctx.lineTo(198 * rpx, (238 + contentHh * j) * rpx)//lineTo(栏吐)线至   里面的值是点在画布里横轴纵轴的位置
      //设置线条颜色
      ctx.strokeStyle = "#999999"//strokeStyle(斯轴可 斯忒偶)
      //设置线条宽度
      ctx.lineWidth = 1 * rpx;//lineWidth(栏歪特)线条宽度
      //图形串联，画出图形
      ctx.stroke();//stroke(斯轴可)

      //虚线
      ctx.beginPath()//beginPath(被根帕斯)
      ctx.setLineDash([3 * rpx, 2 * rpx]); //定义虚线 第一个参数：是虚线的粗细   第二个参数是虚线点点之间的间距 
      //定义线条的起始点
      ctx.moveTo(0, (256 + contentHh * j) * rpx)//moveTo:移动至(木吐)  里面的值是点在画布里横轴纵轴的位置
      //定义线条的结束点
      ctx.lineTo(375, (256 + contentHh * j) * rpx)//lineTo(栏吐)线至   里面的值是点在画布里横轴纵轴的位置
      //设置线条颜色
      ctx.strokeStyle = "#AEAEAE"//strokeStyle(斯轴可 斯忒偶)
      //设置线条宽度
      ctx.lineWidth = 1 * rpx;//lineWidth(栏歪特)线条宽度
      //图形串联，画出图形
      ctx.stroke();//stroke(斯轴可)

      // 识别小程序 字
      if (cardInfo.Company) {
        ctx.setFontSize(15 * rpx);
        ctx.setFillStyle('#333333');
        ctx.setTextAlign('left');
        //第一个参数：在画布上输出的文本； 第二个参数：图像距离画布的左上角 x 坐标    第三个参数：图像距离画布的上角 y 坐标 
        ctx.fillText(cardInfo.Company, 29 * rpx, (302 + contentHh * j) * rpx);
      }
      // 绘制二维码
      if (codeSrc) {
        //第一个参数：所要绘制的图片资源  第二个参数：图像距离画布的左上角 x 坐标
        //第三个参数：图像距离画布的上角 y 坐标 第四个参数:源图像的矩形选择框的宽度  第五个参数：图形高度
        ctx.drawImage(codeSrc, 165 * rpx, (272 + contentHh * j) * rpx, 76 * rpx, 76 * rpx)
      }

    }).exec() //执行所有的请求。请求结果按请求次序构成数组 
    setTimeout(function () {
      ctx.draw();// 将之前在绘图上下文中的描述（路径、变形、样式）画到 canvas 中。
      wx.hideLoading(); //隐藏 loading 提示框
    }, 1000)
    console.log(ctx)

  },
  /**
  * 多行文字处理，每行显示数量
  * @param text 为传入的文本
  * @param num  为单行显示的字节长度
  */
  textByteLength(text, num) {
    //console.log(text,num) 
    let strLength = 0; // text byte length
    let rows = 1;
    let str = 0;
    let arr = [];
    for (let j = 0; j < text.length; j++) {
      if (text.charCodeAt(j) > 255) {
        strLength += 2;
        if (strLength > rows * num) {
          strLength++;
          arr.push(text.slice(str, j));
          str = j;
          rows++;
        }
      } else {
        strLength++;
        if (strLength > rows * num) {
          arr.push(text.slice(str, j));
          str = j;
          rows++;
        }
      }
    }
    arr.push(text.slice(str, text.length));
    return [strLength, arr, rows] //  [处理文字的总字节长度，每行显示内容的数组，行数]
  },
  // //点击保存到相册
  saveShareImg: function () {
    var that = this;
    wx.showLoading({
      title: '正在保存',
      mask: true,
    })
    // setTimeout(function () {
    wx.canvasToTempFilePath({  //把当前画布指定区域的内容导出生成指定大小的图片
      canvasId: 'myCanvas', //画布标识，传入 canvas 组件的 canvas-id  wxml里定义的画布id
      success: function (res) { //成功的回调函数  console.log(res) 得到的具体信息
        wx.hideLoading(); //隐藏loading提示框
        // var tempFilePath = ; //图片路径
        // console.log(tempFilePath)
        wx.saveImageToPhotosAlbum({ //保存图片到系统相册
          filePath: res.tempFilePath, //图片文件路径，可以是临时文件路径或永久文件路径，不支持网络图片路径
          success: function (res) { //成功回调
            //console.log(res)
            wx.showModal({ //显示模态对话框
              content: '图片已保存到相册，赶紧晒一下吧~', //提示的内容
              showCancel: false,  //是否显示取消按钮
              confirmText: '好的',  //确认按钮的文字，最多 4 个字符
              confirmColor: '#333',  //确认按钮的文字颜色，必须是 16 进制格式的颜色字符串
            })
          },
          fail: function (res) {
            //console.log(res)
            wx.showToast({  //显示消息提示框
              title: "保存到相册失败",
              icon: 'none', //图标
              duration: 2000 //提示的延迟时间 
            })
          }
        })
      }
    });
  },
  logbut() {
    wx.navigateTo({
      url: '/pages/logs/logs',
    })
  }
})